import React, { PropTypes } from 'react';

import { Menu, Icon, Switch, Breadcrumb, notification, Popover, Button, Modal, Form, Input, message} from 'antd';
const SubMenu = Menu.SubMenu;

import './less/list.less';

class List extends React.Component {
  static contextTypes = {
      timeColor:PropTypes.string,
      dataSource:PropTypes.array,
      color:PropTypes.string,
      clickCallbak:PropTypes.func,
      fontSize:PropTypes.number
  };

  static defaultProps = {
      timeColor:'#666',
      color:'#666',
      dataSource:[],
      fontSize:12
  };

  constructor(props){
    super(props);
    this.state = {

    }
  }

  componentDidMount(){

  }

  clickCallbak(obj){
      this.props.clickCallbak(obj);
  }

  _renderRow(dataSource){
      return dataSource.map((ele,index)=>{
          let _date = null;
          if(ele.date){
              _date = (
                  <span className="date" style={{color:this.props.timeColor}}>{ele.date}</span>
              )
          }
          return(
            <li key={index} className="dataList" onClick={this.clickCallbak.bind(this,ele)} style={{fontSize:this.props.fontSize,color:this.props.color}}>
                {_date}
                <span className="listContent">{ele.motice}</span>
            </li>
          )
      })

  }

  render() {
    return (
        <ul>
          {
            this._renderRow(this.props.dataSource)
          }
        </ul>
    )
  }
}

export default List;
